* {
    padding: 0;
    margin: 0;
}

body {
    text-align: left;
}

.raven-button {
    background-color: #f8eb84;
    padding: 10px 20px;
    cursor: pointer;
    transition: 0.4s;
    display: flex;
    align-items: center;
    font-family: Millik-Regular;
    justify-content: center;
    border: 0;
    &:hover {
        background-color: #000;
        color: #f8eb84;
    }
}

.nav {
    position: fixed;
    left: 0;
    top: 0;
    width: 100%;
    padding: 1.7% 7.5% 1.7% 7.5%;
    display: flex;
    justify-content: space-between;
    z-index: 1;
    box-sizing: border-box;
    background-color: #fff;
    box-shadow: 0px 10px 24px 0px rgba(0, 0, 0, 0.07);
    font-family: Millik-Bold;
    .nav-left {
        display: flex;
        h1 {
            font-family: Millik;
        }
        .nav-btn {
            cursor: pointer;
            display: flex;
            justify-content: center;
            align-items: center;
            background-color: #f8eb84;
            margin-left: 30px;
            padding: 0 10px;
        }
    }
}

.nav-wrapper {
    width: 100%;
    height: 100vh;
    position: fixed;
    left: 0;
    top: 0;
    z-index: -10;
    background-color: rgba(186, 163, 223, 0.9);
    opacity: 0;
    visibility: hidden;
    transition: 0.3s;
    .close {
        position: absolute;
        right: 20px;
        top: 20px;
        cursor: pointer;
        &:hover {
            path {
                transition: 0.4s;
                fill: #f8eb84 !important;
            }
        }
    }
    .menu {
        position: absolute;
        top: 50%;
        left: 50%;
        list-style: none;
        transform: translate(-50%, -50%);
        font-family: Millik-Bold;
        .menu-list {
            font-size: 50px;
            cursor: pointer;
            margin: 20px 0;
            color: #fff;
            text-align: center;
            &:hover {
                color: #f8eb84;
            }
            &:nth-child(1) {
                color: #f8eb84;
            }
        }
    }
}

.elementor-title {
    width: 100%;
    position: relative;
    padding: 0px 0px 70px 0px;
    box-sizing: border-box;
    display: flex;
    justify-content: center;
    align-items: center;
    .elementor-container {
        width: 32.274%;
        text-align: center;
        .elementor-heading-title {
            font-family: Millik-Regular;
            font-size: 20px;
            color: #b4b4b4;
            font-weight: 400;
        }
        .elementor-widget-container {
            font-size: 45px;
        }
    }
}

.elementor-1 {
    width: 100%;
    height: 100vh;
    background-image: url(../../asset/img/show-1.jpg);
    background-position: top right;
    background-repeat: no-repeat;
    background-size: 960px auto;
    position: relative;
    margin-bottom: 100px;
    .elementor-1-container {
        position: absolute;
        left: 10%;
        top: 40%;
        transform: translate(-10%, -40%);
        .elementor-1-title {
            font-size: 80px;
            z-index: 10;
            width: 70%;
            font-family: Millik-Bold;
            opacity: 0;
            transform: translateY(-20%);
        }
        .elementor-1-img {
            position: absolute;
            right: 20%;
            top: 5%;
            transform: translateX(-50%);
            width: 80px;
            height: 80px;
            img {
                width: 100%;
                height: 100%;
            }
        }
    }
}

.elementor-3 {
    width: 100%;
    position: relative;
    padding: 0px 0px 230px 100px;
    box-sizing: border-box;
    .elementor-3-container {
        width: 100%;
        display: flex;
        margin-right: auto;
        margin-left: auto;
        position: relative;
        .slick-slide {
            img {
                width: 454px;
                opacity: 1;
                transition: opacity 500ms ease 0s;
            }
        }
        .slick-right {
            padding: 0% 15% 0% 5%;
            .elementor-widget-text {
                margin-bottom: 3rem;
                font-family: Millik-Regular;
                font-size: 15px;
            }
            .elementor-btn-wrap {
                display: flex;
                justify-content: space-between;
                .slick-btn {
                    margin-bottom: 10px;
                    width: 30% !important;
                    height: 50px !important;
                    font-family: Millik-Regular;
                }
            }
        }
    }
}

.elementor-5 {
    width: 100%;
    position: relative;
    padding: 0px 0px 200px 0px;
    box-sizing: border-box;
    display: flex;
    justify-content: center;
    align-items: center;
    opacity: 0;
    .elementor-5-container {
        display: flex;
        .elementor-card {
            flex: 1;
            margin: 40px;
            .card-title {
                text-align: center;
                padding: 20px 0;
                transform: translateY(-5px);
                transition: 0.4s;
                font-size: 30px;
                font-family: Millik-Bold;
            }
            img {
                width: 100%;
                height: auto;
            }
            &:hover {
                .card-title {
                    background: #f8eb84;
                }
            }
        }
    }
}

.elementor-6 {
    width: 100%;
    position: relative;
    padding: 0px 0px 800px 0px;
    box-sizing: border-box;
    display: flex;
    justify-content: center;
    align-items: center;
    margin-bottom: 100px;
    .elementor-6-container {
        width: 32.274%;
        text-align: center;
        .elementor-heading-title {
            font-family: Playfair Display;
            font-size: 30px;
            color: #b4b4b4;
            font-weight: 400;
        }
        .elementor-6-img {
            position: absolute;
            opacity: 0;
        }
        .img-1 {
            width: 450px;
            height: auto;
            left: 10%;
        }
        .img-2 {
            right: 10%;
            width: 600px;
            height: auto;
        }
        .img-3 {
            left: 10%;
            bottom: -5%;
            width: 350px;
            height: auto;
        }
        .img-4 {
            width: 400px;
            height: auto;
            right: 10%;
            bottom: 0%;
        }
    }
}

.elementor-8 {
    width: 100%;
    position: relative;
    padding: 0px 0px 70px 0px;
    box-sizing: border-box;
    display: flex;
    justify-content: center;
    align-items: center;
    .elementor-8-container {
        width: 100%;
        text-align: center;
        display: flex;
        align-items: center;
        justify-content: center;
        font-family: Millik-Regular;
        .elementor-list-wrapper {
            width: 25%;
            margin: 10px;
            .list {
                list-style: none;
                .list-item {
                    border-width: 0px 0px 1px 0px;
                    border-style: solid;
                    display: flex;
                    padding: 20px 0px 25px 0px;
                    justify-content: space-between;
                    h5 {
                        font-family: Millik-Regular;
                        font-size: 18px;
                        font-weight: 400;
                        color: #000000;
                    }
                }
            }
        }
    }
}

.elementor-9 {
    width: 100%;
    position: relative;
    padding: 0px 0px 70px 0px;
    box-sizing: border-box;
    display: flex;
    justify-content: center;
    align-items: center;
    .elementor-9-container {
        width: 32.274%;
        text-align: center;
        .elementor-heading-title {
            font-family: Millik-Regular;
            font-size: 30px;
            color: #b4b4b4;
            font-weight: 400;
        }
        .elementor-widget-container {
            font-size: 45px;
        }
    }
}

.elementor-10 {
    width: 100%;
    position: relative;
    padding: 0px 0px 70px 0px;
    box-sizing: border-box;
    transform: translateX(-100px);
    opacity: 0;
    .elementor-10-container {
        text-align: center;
        display: flex;
        .elementor-card {
            flex: 1;
            margin: 40px;
            img {
                width: 100%;
                height: auto;
            }
            .card-info {
                text-align: center;
                padding: 20px 0;
                display: flex;
                flex-direction: column;
                .info-name {
                    margin: 10px 0;
                    font-family: Millik-Regular;
                }
                .position {
                    font-family: Moderat-Medium;
                }
            }
        }
    }
}

.elementor-11 {
    width: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 0px 0px 200px 0px;
    .elementor-11-container {
        text-align: center;
        font-family: Millik;
        font-size: 30px;
        .elementor-heading-title {
            margin: 20px 0;
        }
    }
}

@media (max-width: 1200px) {
    .elementor-title {
        width: 100%;
        position: relative;
        padding: 0px 0px 70px 0px;
        box-sizing: border-box;
        display: flex;
        justify-content: center;
        align-items: center;
        .elementor-container {
            width: 100%;
            text-align: center;
            .elementor-heading-title {
                font-family: Millik-Regular;
                color: #b4b4b4;
                font-weight: 400;
            }
            .elementor-widget-container {
                font-size: 45px;
            }
        }
    }

    .elementor-1 {
        height: 80vh;
        background-position: center right;
        background-size: 40% auto;
        .elementor-1-container {
            .elementor-1-title {
                font-size: 3rem;
                z-index: 10;
                width: 70%;
                font-family: Millik-Bold;
                opacity: 0;
                transform: translateY(-20%);
            }
            .elementor-1-img {
                position: absolute;
                right: 0%;
                top: 5%;
                width: 50px;
                height: 50px;
                img {
                    width: 100%;
                    height: 100%;
                }
            }
        }
    }
    .elementor-3 {
        padding: 0px 20px 230px 20px;
        .elementor-3-container {
            display: flex;
            flex-direction: column;
            justify-content: center;
            align-items: center;
            .slick-right {
                padding: 5% 0 0 0 !important;
            }
        }
    }
    .elementor-5 {
        padding: 0px 0px 50px 0px;
    }
    .elementor-6 {
        padding: 0px 0px 10px 0px;

        .elementor-6-container {
            width: 100%;
            display: flex;
            flex-direction: column;
            justify-content: center;
            align-items: center;
            .elementor-6-img {
                position: static;
                opacity: 0;
                margin: 10px 0;
            }
            .img-1 {
                width: 40%;
                height: auto;
            }
            .img-2 {
                width: 40%;
                height: auto;
            }
            .img-3 {
                width: 40;
                height: auto;
            }
            .img-4 {
                width: 40%;
                height: auto;
            }
        }
    }
}

@media (max-width: 768px) {
    .nav {
        .nav-left {
            width: 100%;
            flex-direction: row;
            align-content: center;
            justify-content: space-between;
            h1 {
                font-size: 5vw;
            }
        }
        .raven-button {
            display: none;
        }
    }
    .elementor-1 {
        height: 60vh;
        background-position: center center;
        background-size: 100% auto;
        color: #fff;
        margin-bottom: 40px;
        &::before {
            content: "";
            display: block;
            width: 100%;
            height: 100%;
            background: rgba(255, 255, 255, 0.25);
            backdrop-filter: blur(4px);
            -webkit-backdrop-filter: blur(4px);
        }
        .elementor-1-container {
            width: 100%;
            left: 50%;
            top: 50%;
            transform: translate(-50%, -50%);
            .elementor-1-title {
                width: 100%;
                text-align: center;
            }
            .elementor-1-img {
                display: none;
            }
        }
    }
    .elementor-3 {
        padding: 0px 20px 230px 20px;
        .elementor-3-container {
            display: flex;
            flex-direction: column;
            justify-content: center;
            align-items: center;
            .slick-right {
                padding: 5% 0 0 0 !important;
            }
        }
    }
    .elementor-5 {
        padding: 0px 0px 50px 0px;
        .elementor-5-container {
            flex-direction: column;
        }
    }
    .elementor-10 {
        .elementor-10-container {
            flex-direction: column;
        }
    }
}
